import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:zywz/constants/Constants.dart';

import '../constants/ChinaCities.dart';

class CityPicker extends StatefulWidget {
  final String initialProvince;
  final String initialCity;
  final Function(String, String) onConfirm;
  final Function() onCancel;

  const CityPicker({
    Key? key,
    required this.initialProvince,
    required this.initialCity,
    required this.onConfirm,
    required this.onCancel,
  }) : super(key: key);

  @override
  State<CityPicker> createState() => _CityPickerState();
}

class _CityPickerState extends State<CityPicker> {
  late String _selectedProvince;
  late String _selectedCity;

  @override
  void initState() {
    super.initState();
    _selectedProvince = widget.initialProvince;
    _selectedCity = widget.initialCity;
    
    // 确保初始城市在选中省份的城市列表中
    if (!ChinaCities.cities.containsKey(_selectedProvince) ||
        !ChinaCities.cities[_selectedProvince]!.contains(_selectedCity)) {
      _selectedCity = ChinaCities.cities[_selectedProvince]?.first ?? '';
    }
  }

  @override
  Widget build(BuildContext context) {
    final provinces = ChinaCities.provinces;
    final cities = ChinaCities.cities[_selectedProvince] ?? [];

    return Container(
      height: 300,
      color: Colors.white,
      child: Column(
        children: [
          // 标题栏
          Container(
            height: 48,
            decoration: const BoxDecoration(
              border: Border(
                bottom: BorderSide(color: Color(0xFFE0E0E0)),
              ),
            ),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                TextButton(
                  onPressed: widget.onCancel,
                  child: const Text(
                    '取消',
                    style: TextStyle(
                      color: Color(0xFF41C7DD),
                      fontSize: 16,
                    ),
                  ),
                ),
                const Text(
                  '选择城市',
                  style: TextStyle(
                    color: Colors.black,
                    fontSize: 18,
                    fontWeight: FontWeight.bold,
                  ),
                ),
                TextButton(
                  onPressed: () => widget.onConfirm(_selectedProvince, _selectedCity),
                  child: const Text(
                    '确认',
                    style: TextStyle(
                      color: Color(0xFF41C7DD),
                      fontSize: 16,
                    ),
                  ),
                ),
              ],
            ),
          ),

          // 当前选择显示
          Container(
            padding: const EdgeInsets.symmetric(horizontal: 20, vertical: 10),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Text(
                  '$_selectedProvince - $_selectedCity',
                  style: const TextStyle(
                    color: Colors.black,
                    fontSize: 16,
                    fontWeight: FontWeight.bold,
                  ),
                ),
                const SizedBox(width: 8),
                const Icon(
                  Icons.arrow_drop_down,
                  color: Colors.grey,
                ),
              ],
            ),
          ),

          // 滚轮选择器
          Expanded(
            child: Row(
              children: [
                // 省份选择器
                Expanded(
                  child: CupertinoPicker(
                    scrollController: FixedExtentScrollController(
                      initialItem: provinces.indexOf(_selectedProvince),
                    ),
                    itemExtent: 40,
                    onSelectedItemChanged: (index) {
                      setState(() {
                        _selectedProvince = provinces[index];
                        // 省份变化时，自动选择该省份的第一个城市
                        _selectedCity = ChinaCities.cities[_selectedProvince]?.first ?? '';
                      });
                    },
                    children: provinces.map((province) {
                      return Center(
                        child: Text(
                          province,
                          style: const TextStyle(
                            fontSize: 18,
                            color: Colors.black,
                          ),
                        ),
                      );
                    }).toList(),
                  ),
                ),

                // 分割线
                Container(
                  width: 1,
                  color: const Color(0xFFE0E0E0),
                ),

                // 城市选择器
                Expanded(
                  child: CupertinoPicker(
                    key: ValueKey(_selectedProvince), // 省份变化时重建选择器
                    scrollController: FixedExtentScrollController(
                      initialItem: cities.indexOf(_selectedCity).clamp(0, cities.length - 1),
                    ),
                    itemExtent: 40,
                    onSelectedItemChanged: (index) {
                      setState(() {
                        _selectedCity = cities[index];
                      });
                    },
                    children: cities.map((city) {
                      return Center(
                        child: Text(
                          city,
                          style: const TextStyle(
                            fontSize: 18,
                            color: Colors.black,
                          ),
                        ),
                      );
                    }).toList(),
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}